<div class="content-form">
    <h2><{t}>找回密码<{/t}></h2>
    <!-- 找回密码 -->
    <div id="forgot_content" class="forgot-content signupin-content">
        <div class="forgot_con">
            <form action="<{link app=b2c ctl=site_passport act=sendPSW}>" method="post">
                <input name="forward" type="hidden" value="<{$options.url}>">
                <ul class="list-unstyled">
                    <li style="display: none">
                        <label for=""><{t}>登录类型：<{/t}></label>&nbsp;
                        <div class="radio-inline">
                            <label>
                                <input type="radio" name="reg_style" value="0" checked="checked" id="em" onclick="javascript:$(reg_email).setStyle('display','block');$(reg_phone).setStyle('display','none');$$('.action-mobile-verify').setStyle('display','none');$(e).set('value','')">
                                <{t}>邮箱<{/t}>
                            </label>
                        </div>
                        <div class="radio-inline">
                            <label>
                                <input type="radio" name="reg_style" value="1" id="te" onclick="javascript:$(reg_email).setStyle('display','none');$(reg_phone).setStyle('display','block');$$('.action-email-verify').setStyle('display','none');$$('.action-verifycode').setStyle('display','block');$(check_tel).set('value','');">
                                <{t}>手机<{/t}>
                            </label>
                        </div>
                        <div class="clearfix"></div>
                        <!--<span class="form-act"><{input type="text" name="username" id="" placeholder="用户名/手机号码/邮箱地址" autofocus vtype="required" data-caution="请填写您的账户名"}></span>
                        <span class="caution-content"><{$msg}></span>-->
                    </li>
                    <li id="reg_email">
                        <div class="form-group">
                            <label for=""><{t}>Введите ваш логин:<{/t}></label>
                            <span class="form-act"><{input id="e" type="text" signup_type="email" name="username_email" class="action-account-check form-control" placeholder=$___b2c="邮箱"|t:'b2c' vtype="required&&email" data-caution=$___b2c="请填写登录帐号，最少4个字符"|t:'b2c' autofocus}><span class="validation-messagebox"></span></span>
                        </div>
                    </li>
                    <li class="reg_phone" style="display:none;"  id="reg_phone">
                        <label for=""><{t}>Введите телефон<{/t}></label>
                        <div class="row">
                            <{if $phones}>
                            <!--手机验证-->
                            <div class="col-lg-4 col-md-4 col-sm-4 col-xs-4">
                                <div class="form-group">
                                    <select name="phone_setting" id="quhao" class="form-control">
                                        <{foreach from=$phones item=items}>
                                        <option sid="<{$items.length}>" value="<{$items.area}>"><{$items.country}><{$items.area}></option>
                                        <{/foreach}>
                                    </select>
                                </div>
                            </div>
                            <div class="col-lg-8 col-md-8 col-sm-8 col-xs-8">
                                <div class="form-group">
                                    <{input type="hidden" name="phone_length" value="" id="phone_length"}>
                                    <{input type="text" name="username_phone" signup_type="mobile"  placeholder=$___b2c="请填写手机号"|t:'b2c' vtype="required"  id="check_tel" class="action-account-check form-control"}>
                                </div>
                            </div>
                            <{else}>
                            <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
                                <div class="form-group">
                                    <{input type="text" name="username_phone" signup_type="mobile"  placeholder=$___b2c="请填写手机号"|t:'b2c' id="check_tel" class="action-account-check form-control" }>
                                </div>
                            </div>
                            <{/if}>
                        </div><!--row-->
                    </li>
                    <li>



                        <span class="form-group" style="display: inline-block;padding-top:7px;"><{t}>记起密码？<{/t}> <a href="<{link app=b2c ctl=site_passport act=login}>"><{t}>登录<{/t}></a></span>
                        <{button style='margin-right:20px;' type="submit" label=$___b2c="下一步"|t:'b2c' class="btn btn-primary pull-right" rel="_request" data-ajax-config="{onSuccess:function(rs){changeStep(rs, 2);}}"}>
                        <div class="clearfix"></div>

                    </li>
                </ul>
            </form>
        </div>
    </div>
</div> <!--/content-form-->
<script>
    var module = $('forgot_content');
    var Query = {
        send: function(url, data, fn){
            new Request({
                url: url,
                link: 'cancel',
                onSuccess: function(rs) {
                    if(rs) {
                        try{
                            rs = JSON.decode(rs);
                        } catch (e) {}
                        if(typeof rs.error === 'string') Message.error(rs.error);
                        fn&&fn.call(this, rs);
                    }
                }
            }).post(data);
        }
    };

    function changeStep(rs, x, fn) {
        if(rs && rs[0]) {
            if(typeOf(rs[0]) === 'string') {
                module.innerHTML = rs[0];
                //下边这句没有用到，会导致浏览器报js错误。
                //  if(x) $('forgot_steps').getElement('.active').removeClass('active').getSiblings('.step-' + x).addClass('active');
            }
            else if(typeOf(rs[0]) === 'object') {
                if(rs[0].error) return Message.error(rs[0].error);
            }
            fn && fn.call(this);
        }
    }


    module.addEvents({
        'change:relay(.action-verify-method)': function(e) {
            var form = this.getParent('form');
            form.getElements('.op-verify-mobile, .op-verify-email').addClass('hide');
            form.getElements('.op-verify-' + this.value).removeClass('hide');
        },
        'click:relay(.action-resend-email)':function(e) {
            e.stop();
            if(this.hasClass('disabled')) return false;
            var url = this.href;
            var data = JSON.decode(this.get('data-params'));
            sendVerify(this, data);
            changeStep();
//        Query.send(url, data, changeStep);
        },
        'click:relay(.auto-change-verify-handle)': function(e) {
            e.preventDefault();
            changeVerify(this);
        },
        'click:relay(.action-get-verifycode)': function(e) {
            e.stop();
            if(this.hasClass('disabled')) return false;
            var form = this.getParent('form');
            sendVerify(this, 'uname=' + form.getElement('#check_tel').value + '&type=forgot' + '&phone_setting='+ form.getElement('#forgot-phone-setting').value  + '&email=' + form.getElement('#forgot_email').value);
        }
    });
    function sendVerify(el, data) {
        var url = el.href;
        el.addClass('disabled');
        var textCont = el.getElement('span span');
        textCont.innerHTML = el.get('text') + '(<i>0</i>)';
        var cd = new countdown(textCont.getElement('i'), {
            start: 120,
            secondOnly: true,
            callback: function(e) {
                el.removeClass('disabled');
                textCont.innerHTML = '<{t}>重发验证码<{/t}>';
            }
        });
        Query.send(url, data, function(rs) {
            if(rs.error) {
                cd.stop();
                el.removeClass('disabled');
                textCont.innerHTML = '<{t}>重发验证码<{/t}>';
            }
        });
    }

    $('quhao').addEvent('change',function(){
        $('check_tel').set('value','');
    });
</script>
